<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>正则表达式</title>
    <script>
        function f1(){
            let inText = document.getElementById("inText").value;
            // 直接量语法
            // 定义一个正则表达式规则
            // let regExp = /[a-zA-Z]/;
            let regExp = /[a-z]/i;
            // 可以通过正则对象调用判定方法
            if(regExp.test(inText)){
                document.getElementById("result").innerHTML = "<span style='color:green;font-size: 12px;'>校验通过</span>";
            } else{
                document.getElementById("result").innerHTML = "<span style='color:red;font-size: 12px;'>格式不对</span>";
            }
        }

        function f2(){
            let inText = document.getElementById("inText").value;
            // 通过RegExp对象的方式
            // 定义一个正则表达式规则
            let regExp = new RegExp("[a-z]","i");
            // 可以通过正则对象调用判定方法
            if(regExp.test(inText)){
                document.getElementById("result").innerHTML = "<span style='color:green;font-size: 12px;'>校验通过</span>";
            } else{
                document.getElementById("result").innerHTML = "<span style='color:red;font-size: 12px;'>格式不对</span>";
            }
        }
        function f3(){
            let inText = document.getElementById("inText").value;
            // 直接量语法
            // 定义一个正则表达式规则
            // let regExp = /[a-zA-Z]/;
            let regExp = /^[a-z]+$/i;
            // 可以通过正则对象调用判定方法
            if(regExp.test(inText)){
                document.getElementById("result").innerHTML = "<span style='color:green;font-size: 12px;'>校验通过</span>";
            } else{
                document.getElementById("result").innerHTML = "<span style='color:red;font-size: 12px;'>格式不对</span>";
            }
        }
    </script>
</head>
<body>
<input type="text" id="inText">
<span id="result"></span><br>
<button onclick="f1()">定义方式一</button><br>
<button onclick="f2()">定义方式二</button><br>
<button onclick="f3()">完整匹配</button><br>
</body>
</html>